
<style>
*{
    margin: 0;
    padding: 0;
}
canvas{
    background-color: yellow;
}

</style>
<canvas id="canvas" ></canvas>] 

<script>
 const canvas=document.getElementById('canvas')
 const resizeCanvas=()=>{
    canvas.width=window.innerWidth
   canvas.height=window.innerHeight
 }
window.onresize=resizeCanvas

resizeCanvas()

const ctx=canvas.getContext('2d')
// ctx.fillRect(100,100,200,200)

ctx.beginPath()
ctx.moveTo(10,20)
ctx.lineTo(300,20)
ctx.lineTo(100,400)
ctx.closePath()
ctx.fill()//填充
ctx.stroke()

ctx.lineWidth=3
ctx.strokeStyle='red'//描边
ctx.stroke()




</script>